<template>
    <div class="app-container">
        <!-- 基础信息 -->
        <h5 class="titleInfo">
            基础信息
        </h5>
        <el-form class="form" ref="form"  :model="form" :rules="rules" label-width="130px">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="医院名称" prop="hospitalId">
                        <el-select v-model="form.hospitalId" placeholder="请选择">
                            <el-option
                                v-for="item in officeOption"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="医生姓名" prop="name">
                        <el-input v-model="form.name"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="职位" prop="positionId">
                        <el-select v-model="form.positionId" placeholder="请选择">
                            <el-option
                                v-for="item in loanOption"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="学历职称" prop="tagIDList">
                        <el-select
                            v-model="form.tagIDList"
                            multiple
                            filterable
                            :multiple-limit="2"
                            allow-create
                            default-first-option
                            placeholder="请选择">
                            <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="擅长项目" prop="labelIDList">
                        <el-select
                            v-model="form.labelIDList"
                            multiple
                            filterable
                            allow-create
                            default-first-option
                            placeholder="请选择">
                            <el-option
                            v-for="item in labelOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="排序" prop="sort">
                        <el-input v-model="form.sort"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="简介" prop="descript">
                        <el-input v-model="form.descript"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="评星" prop="star">
                        <el-rate
                            :texts="starTxt"
                            style="margin-top:8px"
                            v-model="form.star"
                            show-text>
                        </el-rate>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="医生照片" prop="image">
                        <!-- <uploadImg ref="uploadImg" :fileNum="fileNum" :fileList="fileList"></uploadImg> -->
                        <newUpload ref="uploadImg" :fileNum="fileNum" :width='imgWeith' :fileList="fileList" :height="imgHeight" />
                        <p>图片尺寸100px*100px</p>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="详情" prop="content">
                        <Tinymce style="width:96%" v-model="form.content"></Tinymce>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-form-item>
                <el-button style="margin:30px 0" type="primary" @click="submitFn('form')" >立即提交</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>
<script>
import newUpload from "@/components/imgUpload/index";
import uploadImg from '@/components/UploadImg/index'
import Tinymce from '@/components/Tinymce'
import { hospitalAdd } from '@/api/hospitalAdd'
// import { companyList } from '@/api/branchOfficeDropDown'
import { loanDropDown } from '@/api/loanDropDown'
import { hospitalDropDown,createDoctor,getForGoodAtProjectList,doctorDetail,updateDoctor } from '@/api/doctorManage'
import { findPositionList } from '@/api/jobTitle'
import { findDoctorTagsList } from '@/api/degreeTitles'



export default {
    name:"doctorInfo",
    data(){
        return {
            imgWeith: 100,
            imgHeight: 100,
            starTxt:["1星","2星","3星","4星","5星"],
            fileNum:1,
            fileList:[],
            officeOption:[],
            userId:"",
            statusOption:[{
                    value: '0',
                    label: '是'
                }, {
                    value: '1',
                    label: '否'
                }
            ],
            form:{
                hospitalId:"",
                name:"",
                positionId:"",
                tagIDList:[],
                labelIDList:[],
                sort:"",
                descript:"",
                image:"",
                star:null,
                content:""
            },
            rules:{
                hospitalId:[
                    { required: true, message: '请选择医院名称', trigger: 'blur' }
                ],
                name:[
                    { required: true, message: '请输入医院姓名', trigger: 'blur' }
                ],
                positionId:[
                    { required: true, message: '请选择职位', trigger: 'blur' }
                ],
                tagIDList:[
                    { required: true, message: '请选择学历职称', trigger: 'blur' }
                ],
                labelIDList:[
                    { required: true,  message:'请选择擅长项目',trigger:'blur'}
                ],
                sort:[
                    { required: true, message: '请输入排序', trigger: 'blur' }
                ],
                descript:[
                    { required: true, message: '请输入简介', trigger: 'blur' }
                ],
                image:[
                    { required: true, message: '请上传图片', trigger: 'blur' }
                ],
                star:[
                    { required: true, message: '请评分', trigger: 'blur' }
                ],
                content:[
                    { required: true, message: '请编辑详情', trigger: 'blur' }
                ]
            },
            options: [],
            loanOption:[],
            selectedOptions: [],
            list1:{},
            submitForm:{},
            labelOptions:[]
        }
    },
    components:{uploadImg,Tinymce,newUpload},
    created(){
         //分公司列表
        this.getCompanyList()
    },
    mounted(){
        this.userId = this.$route.query.userId
        this.getInfo()
    },
    methods:{
        //获取详情
        getInfo(){
            let datas ={
                id:this.userId+""
            }
            doctorDetail(datas).then(res =>{
                console.log(res)
                this.form = res.data.data
                this.form.hospitalId = String(this.form.hospitalId)
                this.form.positionId = String(this.form.positionId)
                this.fileList = [{
                    url : localStorage.getItem("imgUrlPrefix")+res.data.data.image
                }]
                this.$refs.uploadImg.getLength(this.fileList)
            })
        },
        //获取分公司列表
        getCompanyList(){
            let datas = {
                pageNum:"0",
                pageSize:"10000"
            }
            findDoctorTagsList(datas).then(res =>{
                // console.log(res)
                let resData = res.data.data.list
                let newData = [];
                resData.forEach(e => {
                    newData.push({
                        value:e.id,
                        label:e.name
                    })
                });
                this.options = newData
                // console.log(newData)
            })
            .catch(error =>{
                this.$message.error(error);
            })
            findPositionList(datas).then(res =>{
                // console.log(res)
                let resData = res.data.data.list
                let newData = [];
                resData.forEach(e => {
                    newData.push({
                        value:e.id+"",
                        label:e.name
                    })
                });
                this.loanOption = newData
            }),
            // 医院列表
            hospitalDropDown().then(res=>{
                let resData = res.data.data
                let newData = [];
                resData.forEach(e => {
                    newData.push({
                        value:e.id+"",
                        label:e.name
                    })
                });
                this.officeOption = newData
                // console.log(this.officeOption)
            })
            //医生擅长项目
            getForGoodAtProjectList().then(res=>{
                let resData = res.data.data
                let newData = [];
                resData.forEach(e => {
                    newData.push({
                        value:e.id,
                        label:e.name
                    })
                });
                this.labelOptions = newData
            })
        },
         // 省市区数据改变
        pcaList(value) {
            let e = this.selectedOptions
            e = value
            this.form.provinceId = e[0]
            this.form.cityId = e[1]
            // this.form.area = e[2]
        },
    }
}
</script>
<style scoped>
    .app-container{padding: 0px!important}
</style>